/*
 * @Author: jiu yin
 * @Date: 2024-05-08 14:14:22
 * @LastEditTime: 2024-06-26 10:27:43
 * @LastEditors: jiu yin zhen jing
 * @FilePath: \studio-web-admin\src\view\entrance\index.tsx
 * jiu
 */
import { useState, useRef } from "react";
import { Radio, ConfigProvider, Input } from "antd";

import { ProTable, ProFormText } from "@ant-design/pro-components";
import type { ActionType } from "@ant-design/pro-components";
import User_avatar from "@/comment/user_avatar";
import { list_ticket } from "@/api/home";
import { parseTime } from "@/utils";

export default function index() {
	const actionRef = useRef<ActionType>(null);

	let [params, set_params] = useState({ status: 1, keyword: "" ,});
	const onChange = (e: any) => {
		console.log(e.target.value);
		set_params({ ...params, status: e.target.value, keyword: "" });
	};
	



	const columns = [
		{
			dataIndex: "index",
			valueType: "indexBorder",
			width: 48,
		},
		{
			title: "入场票/出票时间",
			dataIndex: "nickname",
			hideInSearch: true,
			render: (_: any, item: any) => (
				<div className=" text-14px">
					<p className="c-#9e9fb0">
						入场票：<span className="c-#323557">{item.ticket_no}</span>
					</p>
					<p className="c-#9e9fb0">
						订单号：<span className="c-#323557">{item.order_no}</span>
					</p>
					<p className="c-#9e9fb0">
						出票时间<span className="c-#323557">{parseTime(item.settled_time)}</span>
					</p>
				</div>
			),
		},
		{
			title: "关联订单",
			dataIndex: "order_no",
			hideInSearch: true,
		},

		{
			title: "下单用户  ",
			dataIndex: "nickname",
			hideInSearch: true,
			render: (_: any, item: any) => (
				<User_avatar
					options={{
						avatar_url: item.avatar_url,
						nickname: item.nickname,
						id: item.user_id,
					}}
				/>
			),
		},
		{
			title: "角色昵称",
			dataIndex: "char_name",
			hideInSearch: true,
		},
		{
			title: "角色性别",
			dataIndex: "nickname",
			hideInSearch: true,
			render: (_: any, item: any) => (
				<span>{item.visualize_gender == "F" ? "女" : item.visualize_gender == "M" ? "男" : "_"}</span>
			),
		},
		{
			title: "角色数字人",
			dataIndex: "nickname",
			hideInSearch: true,
			render: (_: any, item: any) => (
				<div>
					{item.is_npc == 1 && (
						<User_avatar
							options={{
								avatar_url: item.char_avatar_url,
								nickname: item.char_nickname,
								id: item.char_user_id,
							}}
						/>
					)}
					{item.is_npc == 2 && "系统NPC"}
				</div>
			),
		},
		{
			title: "使用时间",
			dataIndex: "use_time",
			hideInSearch: true,
			hideInTable: params.status == 1,
		},
	];
	return (
		<div className="base_bg_fff entrance ">
			<div>
				<Radio.Group onChange={onChange} defaultValue={1}>
					<Radio.Button value={1}>待使用的入场票</Radio.Button>
					<Radio.Button value={2}>已使用入场票</Radio.Button>
				</Radio.Group>

				<Input.Search
					placeholder="搜索入场票"
					value={params.keyword}
					onChange={e => set_params({ ...params, keyword: e.target.value as string })}
					allowClear
					style={{
						width: 200,
						marginLeft: 20,
					}}
				/>
			</div>

			<div className="mt-20px ml--24px">
				<ConfigProvider>
					<ProTable
						columns={columns}
						actionRef={actionRef}
						params={params}
						request={async (params, sort, filter) => {
							let { data } = await list_ticket({
								page: params.current,
								limit: params.pageSize,
								...params,
							});
							data.data.forEach((item: any, index: number) => (item.key = index + 1));
							return {
								data: data.data,
								success: true,
								total: data.total,
							};
						}}
						rowKey="key"
						tableAlertRender={false}
						search={false}
						options={false}
						pagination={{
							pageSize: 10,
							hideOnSinglePage: true,
						}}
						dateFormatter="string"
					/>
				</ConfigProvider>
			</div>
		</div>
	);
}
